<template>
	<view :data-theme="themeStyle">
		<block v-if="isShowApply">
			<block v-if="step == 1">
				<scroll-view scroll-y>
					<view>
						<view class="title">基本信息</view>
						<view class="table-block">
							<view class="input-box">	
								<view>企业名称<text class="star">*</text></view>
								<input type="text" v-model="formData.company_name" placeholder="请输入企业名称" />
							</view>
							<view class="input-box">
								<view>联系人<text class="star">*</text></view>
								<input type="text" v-model="formData.contacts_person" placeholder="请输入联系人" />
							</view>
							<view class="input-box">
								<view>联系电话<text class="star">*</text></view>
								<input type="number" v-model="formData.contacts_mobile" placeholder="请输入联系方式" maxlength="11" />
							</view>
							<view class="input-box">
								<view>企业所在地<text class="star">*</text></view>
								<pick-regions :default-regions="defaultRegions" @getRegions="handleGetRegions">
									<text class="select-address" :class="{ 'ns-text-color-gray': !addressValue }">{{ addressValue ? addressValue : '请选择省市区县' }}</text>
								</pick-regions>
							</view>
							<view class="input-box">
								<view>公司详细地址<text class="star">*</text></view>
								<input type="text" v-model="formData.company_address" placeholder="请输入公司详细地址" />
							</view>
						</view>
						<view class="title">公司信息</view>
						<view class="table-block">
							<view class="input-box">
								<view>员工人数</view>
								<picker class="" @change="bindPickerChange" :value="index" :range="teamType" range-key="desc">
									<view class="uni-input " :class="index !== ''?'':'ns-text-color-gray'">{{index !== ''?teamType[index].desc:"请选择员工人数"}}</view>
								</picker>
							</view>
							<view class="input-box">
								<view>法人姓名</view>
								<input type="text" v-model="formData.contacts_name" placeholder="请输入法人姓名" maxlength="15" />
							</view>
							<view class="input-box">
								<view>法人手机号</view>
								<input type="number" v-model="formData.legal_mobile" placeholder="请输入联系方式" maxlength="11" />
							</view>
							<view class="input-box">
								<view>法人身份证号</view>
								<input type="text" v-model="formData.legal_idenNum" placeholder="法人身份证号" maxlength="18" />
							</view>
						</view>
						<view class="table-block ns-margin-top">
							<view class="title">身份证正面图片</view>
							<view class="image-box">
								<view class="image" v-if="businessLicenseImg" @click="uploadImg('businessLicenseImg')">
									<image :src="$util.img(businessLicenseImg)" mode="aspectFit"></image>
								</view>
								<view @click="uploadImg('businessLicenseImg')" class="upload-block" v-else>
									<text class="iconfont iconadd1 ns-text-color-gray-lighten"></text>
								</view>
							</view>
						</view>
						<view class="table-block ns-margin-top">
							<view class="title">身份证反面图片</view>
							<view class="image-box">
								<view class="image" v-if="businessLicenseImg_" @click="uploadImg_('businessLicenseImg_')">
									<image :src="$util.img(businessLicenseImg_)" mode="aspectFit"></image>
								</view>
								<view @click="uploadImg_('businessLicenseImg_')" class="upload-block" v-else>
									<text class="iconfont iconadd1 ns-text-color-gray-lighten"></text>
								</view>
							</view>
						</view>
						
						<view class="title">营业照信息</view>
						<view class="table-block">
							<view class="input-box">
								<view>营业执照号</view>
								<input type="text" v-model="formData.business_licence_number" placeholder="请输入营业执照号" />
							</view>
						</view>
						<view class="table-block">
							<view class="title">营业执照图片</view>
							<view class="image-box">
								<view class="image" @click="uploadImg('enterprise_prove')" v-if="formData.enterprise_prove">
									<image :src="$util.img(formData.enterprise_prove)" mode="aspectFit"></image>
								</view>
								<view @click="uploadImg('enterprise_prove')" class="upload-block" v-else>
									<text class="iconfont iconadd1 ns-text-color-gray-lighten"></text>
								</view>
							</view>
						</view>
						<view class="btn-zw-bar"></view>
					</view>
				</scroll-view>

				<view class="confirm-btn">
					<view @click="nextStep">提交</view>
				</view>
			</block>

		
			<uni-popup ref="uniCover">
				<view class="example-img">
					<image :src="$util.img('upload/uniapp/supply/manage.png')" mode="aspectFit"></image>
				</view>
			</uni-popup>
		</block>
		<loading-cover v-if="formData.team_id > 0" ref="loadingCover"></loading-cover>
	</view>
</template>

<script>
	import uniPopup from '@/components/uni-popup/uni-popup.vue';
	import pickRegions from '@/components/pick-regions/pick-regions.vue';
	import validate from 'common/js/validate.js';
	export default {
		components: {
			pickRegions
		},
		data() {

			return {
				employee:[],
				isShowApply: true,
				step: 1,
				index: '0',
				teamType: [],
				formData: {
					company_name: '', //企业名称
					business_licence_number: '', //组织结构代码
					legal_person: '', //企业法人
					register_time: '', //注册时间
					register_money: '', //注册资金
					company_size: '', //公司人数
					annual_turnover: '', //年营业额
					company_address: '', //公司地址
					company_full_address: '', //公司详细地址
					bank_name: '', //开户行
					bank_account_name: '', //开户名
					bank_account_number: '', //开户账号
					main_products: '', //主营产品
					business_sphere: '', //营业范围
					business_licence_number_electronic: '', //营业执照
					other_information: '', //其它资料
					company_province_id: '', //省市区
					company_city_id: '',
					company_district_id: '',
					enterprise_prove: '', //在职证明
					business_licence_number:'',  //营业执照号
					purchase_name: '', //采购商名称
					contacts_name: '', //姓名
					contacts_sex: 1, //性别
					contacts_department: '', //部门
					contacts_job: '', //职务
					contacts_mobile: '', //联系方式
					// contacts_name:'',//法人姓名
					legal_mobile: '', //法人联系方式
					legal_idenNum: '', //法人身份证号
					contacts_person: '' ,//联系人
					province_name:'',
					city_name:'',
					district_name:'',		
				},
				businessLicenseImg: '',
				businessLicenseImg_:'',
				
				otherThingImg: [],

				defaultRegions: [],
				addressValue: '',
				addressFormValue: '',
				addressValueBank: '',
				addressFormValueBank: '',
				flag: false,
				title: ''
			};
		},
		computed: {
			//vueX页面主题
			themeStyle() {
				return 'theme-' + this.$store.state.themeStyle;
			}
		},
		watch: {
			step(newVal) {
				if (newVal == 2) {
					this.title = '填写个人信息';
				} else if (newVal == 1) {
					this.title = '填写企业认证信息';
				}
			}
		},
		onShow() {
			// this.getTeamType();//团队类型
			this.companyScaleSet()
			this.detail()
		},
		onLoad(options) {
		
		},
		onBackPress() {
			if (this.step > 1) {
				this.step -= 1;
				return true;
			}
		},
		methods: {
			
			onlyEnglishAndHan(key) {
				this.$nextTick(res => {
					this.formData[key] = this.formData[key].replace(/[^\a-\z\A-\Z\u4E00-\u9FA5]/g, '');
				})
			},
			onlyEnglishandNum(key) {
				this.$nextTick(res => {
					this.formData[key] = this.formData[key].replace(/[\W]/g, '');
				})
			},
		
			bindPickerChange(e) {
				this.index = e.target.value
				this.formData.team_type = this.teamType[this.index].id123
			},
			// 获取选择的地区
			handleGetRegions(regions) {
				console.log(regions);
				this.addressFormValue = '';
				this.addressFormValue += regions[0] != undefined ? regions[0].label : '';
				this.addressFormValue += regions[1] != undefined ? regions[1].label : '';
				this.addressFormValue += regions[2] != undefined ? regions[2].label : '';
				this.addressValue = '';
				this.addressValue += regions[0] != undefined ? regions[0].label : '';
				this.addressValue += regions[1] != undefined ? '-' + regions[1].label : '';
				this.addressValue += regions[2] != undefined ? '-' + regions[2].label : '';
				this.formData.company_province_id = regions[0].value;
				this.formData.company_city_id = regions[1].value;
				this.formData.company_district_id = regions[2].value;
				console.log('地域'+this.addressValue)
				// console.log(this.addressFormValue)
				// console.log(this.formData.company_province_id, this.formData.company_city_id, this.formData.company_district_id)
				let temp = this.addressValue.split('-')
				// console.log(this.addressValue.split('-'));
				this.formData.province_name=temp[0];
				this.formData.city_name=temp[1];
				this.formData.district_name=temp[2];
				// console.log(this.formData.province_name);
			},
			// 获取选择的地区
			// handleGetRegionsBank(regions) {
			// 	console.log(regions)
			// 	this.addressFormValueBank = '';
			// 	this.addressFormValueBank += regions[0] != undefined ? regions[0].label : '';
			// 	this.addressFormValueBank += regions[1] != undefined ? regions[1].label : '';
			// 	this.addressFormValueBank += regions[2] != undefined ? regions[2].label : '';
			// 	this.addressValueBank = '';
			// 	this.addressValueBank += regions[0] != undefined ? regions[0].label : '';
			// 	this.addressValueBank += regions[1] != undefined ? '-' + regions[1].label : '';
			// 	this.addressValueBank += regions[2] != undefined ? '-' + regions[2].label : '';
			// 	this.formData.settlement_bank_address = regions[0].label + regions[1].label + regions[2].label;
			// },
			deleteImg(index) {
				this.otherThingImg.splice(index, 1);
			},
			uploadImg(tag) {
				
				var num = tag == 'businessLicenseImg' ? 1 : 3 - this.otherThingImg.length;
				var path = tag == 'businessLicenseImg' ? 'business_license' : 'other_thing';

				this.$util.upload(
					num, {
						method: 'commonImg',
						path
					},
					res => {
						// console.log(res);
						if (tag == 'otherThingImg') {
							res.forEach(item => {
								if (this.otherThingImg.length < 3) {
									this.otherThingImg.push(item);
								}
							});
						} else if (tag == 'enterprise_prove') {
							this.formData.enterprise_prove = res[0];
						} else {
							
							this.businessLicenseImg = res[0];
							// console.log(this.businessLicenseImg );
							// console.log(3);
						}
					}
				);
			},
			// 身份证上传
			uploadImg_(tag) {
				var num = tag == 'businessLicenseImg_' ? 1 : 3 - this.otherThingImg.length;
				var path = tag == 'businessLicenseImg_' ? 'business_license_' : 'other_thing_';
				this.$util.upload(
					num, {
						method: 'commonImg',
						path
					},
					res => {
						console.log(res);
						if (tag == 'otherThingImg_') {
							res.forEach(item => {
								if (this.otherThingImg_.length < 3) {
									this.otherThingImg_.push(item);
								}
							});
						} else if (tag == 'enterprise_prove') {
							this.formData.enterprise_prove = res[0];
						} else {
							this.businessLicenseImg_ = res[0];
						}
					}
				);
			},
			
			// 营业执照
			// selectLicense() {
			// 	let that = this;
			// 	uni.chooseImage({
			// 		count: 1, //只允许上传1张
			// 		sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
			// 		sourceType: ['album'], //从相册选择
			// 		success: function(res) {
			// 			that.license = res.tempFilePaths[0]
			
			// 		}
			// 	});
			// },
			// 增置税执照
			// selectQualification() {
			// 	let that = this;
			// 	uni.chooseImage({
			// 		count: 1, //只允许上传2张
			// 		sizeType: ['original', 'compressed'],
			// 		sourceType: ['album'], //从相册选择
			// 		success: function(res) {
			// 			that.qualification = res.tempFilePaths[0]
			// 		}
			// 	});
			// },
			
			nextStep() {
				console.log(1);
				if (this.vertify()) {
					console.log(2);
					// this.step = 2;
					this.confirm()
				}
				
			},
			
			companyScaleSet(){
				this.$api.sendRequest({
					url: '/api/member/getCompanyScaleSet',
					data: {},
					success: res => { 
						if (res.code == 0) {
							this.teamType = res.data
							// console.log(this.teamType);
						}
					}
				});
			},
			
			// 个人信息
			detail(){
				this.$api.sendRequest({
					url: '/api/member/detail',
					data: {
					},
					success: res => {
						if(res.data.cert_id){
							this.formData.company_name= res.data.company_name.trim(),
							this.formData.contacts_person= res.data.contacts_name.trim(),
							this.formData.contacts_mobile= res.data.contacts_mobile.trim(),
							this.formData.company_address= res.data.address.trim(),
							this.formData.contacts_name= res.data.legal_person_name.trim(),
							this.formData.legal_mobile= res.data.legal_person_mobile.trim(),
							this.formData.legal_idenNum= res.data.card_no.trim(),
							this.businessLicenseImg= res.data.card_electronic_front.trim(),
							this.businessLicenseImg_= res.data.card_electronic_back.trim(),
							this.formData.business_licence_number= res.data.business_licence_number.trim(),//统一社会信用码
							this.formData.enterprise_prove= res.data.business_licence_number_electronic.trim(),
							this.index= res.data.company_scale-1,
							this.formData.company_province_id= res.data.province_id,
							this.formData.company_city_id= res.data.city_id,
							this.formData.company_district_id= res.data.district_id,
							this.formData.province_name= res.data.province_name.trim(),
							this.formData.city_name= res.data.city_name.trim(),
							this.formData.district_name= res.data.district_name.trim()
							if(typeof res.data.province_name !== 'undefined')  this.addressValue +=  res.data.province_name.trim()  +  '-'
							if(typeof res.data.city_name !== 'undefined')  this.addressValue +=  res.data.city_name.trim()  +  '-'
							if(typeof res.data.district_name !== 'undefined')  this.addressValue +=  res.data.district_name.trim()  +  ''
						}
						console.log(this.defaultRegions);
						// this.addressValue = `${res.data.province_name}-${res.data.city_name}-${res.data.district_name}` 
						// this.addressValue =typeof res.data.province_name== 'undefined' ?`${res.data.province_name}-${res.data.city_name}-${res.data.district_name}` :''
						// this.formData.addressValue = res.data.province_name - 
						//省 市	区  name
						// province_name:this.formData.province_name,
						// city_name:this.formData.city_name,
						// district_name:this.formData.district_name,
						// console.log(''+)
					},
				});
			},
			
			
			confirm() {
				if (this.flag) return;
				this.flag = true;
				console.log('teamType'+this.teamType[this.index].desc);
				console.log('index'+this.index);
				if (this.vertify()) {
					let data = this.formData
					this.$api.sendRequest({
						url: '/api/Member/enterpriseCert',
						data: {
							company_name:this.formData.company_name,
							contacts_name:this.formData.contacts_person,
							contacts_mobile:this.formData.contacts_mobile,
							address:this.formData.company_address,
							legal_person_name:this.formData.contacts_name,			//法人姓名
							legal_person_mobile:this.formData.legal_mobile,				//法人手机号
							card_no:this.formData.legal_idenNum,						//联系人身份证
							card_electronic_front:this.businessLicenseImg,	//申请人身份证正面
							card_electronic_back:this.businessLicenseImg_,	//申请人身份证发面
							business_licence_number:this.formData.business_licence_number,		//统一社会信用码
							business_licence_number_electronic :this.formData.enterprise_prove,// 营业执照电子版	
							company_scale:this.index+1,//公司规模 id
							//省 市	区  id
							province_id:this.formData.company_province_id,
							city_id:this.formData.company_city_id,
							district_id:this.formData.company_district_id,
							//省 市	区  name
							province_name:this.formData.province_name,
							city_name:this.formData.city_name,
							district_name:this.formData.district_name,
							
						},
						success: res => {
							if (res.code >= 0) {
								console.log('提交');
								uni.navigateTo({
								    url: '/pages/login/register/audit?company_name=data.company_name&contacts_name=data.contacts_name&address=data.company_address'
								});
								// this.$util.redirectTo('');
							} else {
								this.isSub = false;
								this.$util.showToast({
									title: res.message
								});
							}
							
						},
					});
					// if(this.formData.legal_idenNum!=undefined|| this.formData.legal_mobile!=undefined){
					// 	this.vertify2()
					// }
					// if(this.vertify2()){
					//  let data = this.formData;
					//  if (data.bank_type == 3) {
					//  	data.bank_type = 1
					//  }
					//  data.company_type = 1;
					//  var url = '/yunchuang/api/cert/apply';
					//  this.$api.sendRequest({
					//  	url,
					//  	data,
					//  	success: res => {
					//  		this.flag = false;
					//  		if (res.code == 0) {
					//  			this.$util.showToast({
					//  				title: '提交成功'
					//  			})
					//  			//清空推荐代理商数据
					//  			uni.removeStorage({
					//  				key: 'source_agent',
					//  			});
					//  			this.step = 1;
					//  			// this.getcret()
					//  		} else {
					//  			this.$util.showToast({
					//  				title: res.message
					//  			})
					//  		}
					//  	},
					//  	error: res => {
					//  		this.flag = false;
					//  	}
					//  });
					// }else{
					// let data = this.formData;
					// if (data.bank_type == 3) {
					// 	data.bank_type = 1
					// }
					// data.company_type = 1;
					// var url = '/yunchuang/api/cert/apply';
					// this.$api.sendRequest({
					// 	url,
					// 	data,
					// 	success: res => {
					// 		this.flag = false;
					// 		if (res.code == 0) {
					// 			this.$util.showToast({
					// 				title: '提交成功'
					// 			})
					// 			//清空推荐代理商数据
					// 			uni.removeStorage({
					// 				key: 'source_agent',
					// 			});
					// 			this.step = 1;
					// 			// this.getcret()
					// 		} else {
					// 			this.$util.showToast({
					// 				title: res.message
					// 			})
					// 		}
					// 	},
					// 	error: res => {
					// 		this.flag = false;
					// 	}
					// });
					// }
					// this.formData.company_full_address = this.addressFormValue + this.formData.company_address;

				}
				
				
			},
			vertify() {
				// console.log(4);
				// console.log(this.formData.company_name);
				this.formData.company_name = this.formData.company_name.trim() //企业名称
				// this.addressValue = this.addressValue.trim() //企业地址
				this.formData.company_address = this.formData.company_address.trim() //企业详细地址
				this.formData.contacts_mobile = this.formData.contacts_mobile.trim() //联系电话
				this.formData.contacts_person = this.formData.contacts_person.trim() //联系人
				this.formData.legal_idenNum = this.formData.legal_idenNum.trim()
				this.formData.legal_mobile = this.formData.legal_mobile.trim()
				this.formData.company_province_id = this.formData.company_province_id
				// this.formData.other_information = JSON.stringify(this.otherThingImg);
				var rule = [{
						name: 'company_name',
						checkType: 'required',
						errorMsg: '请输入企业名称'
					},
					{
						name: 'contacts_person',
						checkType: 'required',
						errorMsg: '请输入联系人'
					},
					{
						name: 'contacts_mobile',
						checkType: 'required',
						errorMsg: '请输入联系方式'
					},
					{
						name: 'contacts_mobile',
						checkType: 'phoneno',
						errorMsg: '请输入正确的手机号'
					},
					{
						name: 'company_province_id',
						checkType: 'required',
						errorMsg: '请输入企业地址'
					},
					{
						name: 'company_address',
						checkType: 'required',
						errorMsg: '请输入企业详细地址'
					},

					{
						name: 'legal_mobile',
						isAllowEmpty: true,
						checkType: 'phoneno',
						errorMsg: '请输入正确的手机号'
					},
			
					{
						name: 'legal_idenNum',
						checkType: 'custom',
						isAllowEmpty: true,
						validate: function(value) {
							//18位的和15位的身份证正则
							var reg_18 = /^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/;
							var reg_15 = /^[1-9]\d{5}\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{2}$/;
							return reg_18.test(value) || reg_15.test(value);
						},
						errorMsg: '请输入正确的法人身份证号'
					}, 

				];
			
				var checkRes = validate.check(this.formData, rule);
				if (checkRes) {
					return true;
				} else {
					this.$util.showToast({
						title: validate.error
					});
					this.flag = false;
					return false;
				}
			},
			vertify2() {

				var rule = [{
						name: 'legal_idenNum',
						checkType: 'required',
						errorMsg: '请输入法人身份证号'
					},
					{
						name: 'legal_idenNum',
						checkType: 'idenNum',
						errorMsg: '请输入正确的法人身份证号'
					},
					{
						name: 'legal_mobile',
						checkType: 'required',
						errorMsg: '请输入联系方式'
					},
					{
						name: 'legal_mobile',
						checkType: 'phoneno',
						errorMsg: '请输入正确的手机号'
					}
				];
				var checkRes = validate.check(this.formData, rule);
				if (checkRes) {
					return true;
				} else {
					this.$util.showToast({
						title: validate.error
					});
					this.flag = false;
					return false;
				}
			},
		
		}
	};
</script>
<style lang="scss">
	@import '../public/css/attestation.scss';

	.btn-zw-bar {
		height: 144rpx;
	}

	scroll-view {
		height: calc(100vh - 144rpx)
	}

	/* #ifdef APP-PLUS || MP*/
	scroll-view {
		height: calc(100vh -288rpx)
	}

	/* #endif */
	.uni-input {
		font-size: 28rpx !important;
	}

	.example_img {
		float: right;
		margin-top: 10rpx
	}

	.example-img {
		width: 80vw;
		height: 50vh;

		image {
			width: 100%;
			height: 100%
		}
	}

	// .result{
	// 	padding:100rpx 0;
	// 	text-align: center;
	// 	font-weight: 600;
	// 	background-color: #fff;

	// }
	.result {
		padding: 150rpx 0;
		text-align: center;
		background-color: #fff;

		&.wait {
			color: #3B91FF;
		}

		&.over {
			background-color: #D9F5F4;
			color: #43CBC5;
		}

		&.refuse {
			// background-color: #FFE0D0;
			color: #FF8648;
		}

		&.some {
			// background-color: #FFF8E2;
			color: #FCD14F;
		}

		.img {
			width: 100rpx;
			height: 100rpx;
			margin: auto;

			image {
				height: 100%;
				width: 100%
			}
		}

		.result_text {
			margin-top: 60rpx;
			color: #BDBEC0;
		}

		.result_reson {
			margin-top: 36rpx;
			color: #BDBEC0;
		}

		.result_btn {
			height: 80rpx;
			line-height: 80rpx;
			text-align: center;
			color: #fff;
			font-size: 28rpx;
			border-radius: 8rpx;
			margin: 100rpx 32rpx 20rpx;
			font-weight: 600;
		}
	}

	.status_bar {
		position: fixed;
		top: 0;
		height: var(--status-bar-height);
		background-color: #FFF;
		width: 100%;
		z-index: 2;
	}

	/deep/.uni-navbar--border {
		border: 0 !important
	}

	/deep/.uni-navbar {
		.iconback_light {
			font-size: 44rpx;
		}
	}

	/* #ifdef APP-PLUS || MP */
	/deep/.uni-navbar {
		padding-top: var(--status-bar-height);
	}

	/* #endif */
	/* #ifdef H5 */
	/deep/.uni-navbar {
		.uni-navbar__header-container {
			font-weight: bold;
		}

	}

	/* #endif */
</style>
